<script setup>
import {defineProps} from 'vue'

//子父组件传输数据Props
const props = defineProps({
    type:String
})

</script>
<template>
    <div class="grid-content ep-bg-purple first-1">
        <i class="iconfont icon-suo right-1" v-if="props.type == '支付密码'"></i>
        <i class="iconfont icon-chaoxianejiaoyi right-2" v-if="props.type == '支付限额'"></i>
        <i class="iconfont icon-tihuansuo right-3" v-if="props.type == '修改登录密码'"></i>
        <i class="iconfont icon-5anquanshezhi right-4" v-if="props.type == '安全设置'"></i>

        <i class="iconfont  icon-friends- right-5" v-if="props.type == '切换用户'"></i>
        <div class="size">{{ props.type }}</div>
    </div>
</template>
<style scoped>
.first-1{
    width: 66px;
    /* position: relative; */
    /* top: 30px; */
    margin-top: 25px;
    margin-left: 10px;
}
.size{
    font-size: 12px;
    text-align: center;
}
.right-1{
    text-align: center;
    margin-left: 15px;
    font-size: 30px;
    color: #e616;
}
.right-2{
    text-align: center;
    margin-left: 15px;
    font-size: 30px;
    color: #9e67d8;
}
.right-3{
    text-align: center;
    margin-left: 15px;
    font-size: 30px;
    color: #19fa28;
}
.right-4{
    text-align: center;
    margin-left: 15px;
    font-size: 30px;
    color: #ed1f;
}
.right-5{
    text-align: center;
    margin-left: 15px;
    font-size: 30px;
    color: rgba(100, 51, 233, 0.267);
}

</style>